
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="../common/IncludeTop.jsp"%>
<div id="Content">
<div id="Welcome">
    <div id="WelcomeContent">
        Welcome to MyPetStore!
    </div>
</div>

<div id="Main">
    <div id="Sidebar">
        <div id="SidebarContent">
            <div class="re1">
                <ul>
                    <li ><img src="image/fish1.gif" alt=""></li>
                    <li ><img src="image/fish2.gif" alt=""></li>
                    <li ><img src="image/fish3.gif" alt=""></li>
                    <li ><img src="image/fish4.gif" alt=""></li>
                </ul>
                <a id="a1" href="viewCategory?categoryId=FISH" ><img src="image/fish_icon.gif" /></a>
                <span id="p1"> Saltwater, Freshwater </span>
            </div>
            <div class="re2">
                <ul>
                    <li ><img src="image/dog1.gif" alt=""></li>
                    <li ><img src="image/dog2.gif" alt=""></li>
                    <li ><img src="image/dog3.gif" alt=""></li>
                    <li ><img src="image/dog4.gif" alt=""></li>
                    <li ><img src="image/dog5.gif" alt=""></li>
                    <li ><img src="image/dog6.gif" alt=""></li>
                </ul>
                <a id="a2" href="viewCategory?categoryId=DOGS"><img src="image/dogs_icon.gif" /></a>
                <span id="p2"> Various Breeds </span>
            </div>
            <div class="re3">
                <ul>
                    <li ><img src="image/cat1.gif" alt=""></li>
                    <li ><img src="image/cat2.gif" alt=""></li>
                </ul>
                <a id="a3" href="viewCategory?categoryId=CATS"><img src="image/cats_icon.gif" /></a>
                <span id="p3"> Various Breeds, Exotic Varieties </span>
            </div>
            <div class="re4">
                <ul>
                    <li ><img src="image/snake1.gif" alt=""></li>
                    <li ><img src="image/lizard1.gif" alt=""></li>
                </ul>
                <a id="a4" href="viewCategory?categoryId=REPTILES"><img src="image/reptiles_icon.gif" /></a>
                <span id="p4"> Lizards, Turtles, Snakes  </span>
            </div>
            <div class="re5">
                <ul>
                    <li ><img src="image/bird1.gif" alt=""></li>
                    <li ><img src="image/bird2.gif" alt=""></li>
                </ul>
                <a id="a5" href="viewCategory?categoryId=BIRDS"><img src="image/birds_icon.gif" /></a>
                <span id="p5">  Exotic Varieties </span>
            </div>
        </div>
    </div>
    <!--悬浮窗-->
    <div id="information" style="display: none">sssssssssss</div>
    <script type="text/javascript" src="js/showInformation.js"></script>

    <div id="MainImage">
        <div id="MainImageContent">
            <map name="estoremap">
                <script type="text/javascript" src="js/showInformation.js"></script>
                <area id="selected0" alt="Birds" coords="72,2,280,250" href="viewCategory?categoryId=BIRDS" shape="rect" />
                <area id="selected1" alt="Fish" coords="2,180,72,250" href="viewCategory?categoryId=FISH" shape="rect" />
                <area id="selected2" alt="Dogs" coords="60,250,130,320" href="viewCategory?categoryId=DOGS" shape="rect" />
                <area id="selected3" alt="Reptiles" coords="140,270,210,340" href="viewCategory?categoryId=REPTILES" shape="rect" />
                <area id="selected4" alt="Cats" coords="225,240,295,310" href="viewCategory?categoryId=CATS" shape="rect" />
                <area id="selected5" alt="Birds" coords="280,180,350,250" href="viewCategory?categoryId=BIRDS" shape="rect" />
            </map>
            <img height="355" src="image/splash.gif" align="middle" usemap="#estoremap" width="350" />
        </div>
    </div>
    <div id="Separator">&nbsp;</div>
</div>
</div>
<%@include file="../common/IncludeButtom.jsp"%>
<%-- --%>